<template>
	<view class="container">
		<xk-header :headerbg="true" :back="true" title="招商联系"></xk-header>
		<u-swiper
			:list="list"
			indicator
			indicatorMode="dot"
			circular
			height="180"
		>
		</u-swiper>
		<view class="intro">
			<view class="name">联系方式</view>
			<view class="title">广州昂宝电子</view>
			<view class="content">
			<view class="address"><u-icon name="phone"></u-icon> <text>李小姐 18866668888</text></view>
			<view class="address"><u-icon name="phone" color="#FFFFFF"></u-icon> <text>郑先生 19966668888</text></view>
			<view class="address"><u-icon name="phone" color="#FFFFFF"></u-icon> <text>招商热线 +86-20-28068198</text></view>
			<view class="address"><u-icon name="map"></u-icon> 广东省广州市黄埔区莲花砚路6号</view>
			</view>
			<view class="QR">
				<image :src="qrcode" class="qrcode"></image>
				<view class="scan-QR">扫码关注公众号</view>
				<view class="scan-QR">获取更多最新动态</view>
			</view>
		</view>
		<view style="height:20rpx;"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [
					'http://ceshi.abcu.com.cn/01.jpg',
					'http://ceshi.abcu.com.cn/03.jpg',
				],
				content:'',
				qrcode:'http://ceshi.abcu.com.cn/wechat.jpg'
			};
		},
		onShow() {
			this.getData()
		},
		methods: {
			getData(){
				this.$util.post({
					url: 'wx/slideshow/querySlideshow',
				}).then(res => {
					// console.log('---------------------------', res);
					this.list = res ? res : this.listSwiper
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #f3f4f6;
	}
	.container {
		background-color: #f3f4f6;
		.intro {
			margin:20rpx;
			background-color: #FFFFFF;
			border-radius: 20rpx;
			padding:30rpx 0 50rpx 20rpx;
			.name {
				width: 100%;
				font-size: 34rpx;
				padding-left: 20rpx;
				padding:30rpx 0 30rpx 20rpx;
			}
			.title {
				padding-left: 20rpx;
				color: #2C72FF;
				font-size: 34rpx;
				font-weight: 600;
				padding:10rpx 0 10rpx 20rpx;
			}
			.content {
				padding: 20rpx;
				font-size: 30rpx;
				line-height:48rpx;
			}
			.QR {
				width: 100%;
				text-align: center;
				padding-top:40rpx;
				.qrcode{
					width: 200rpx;
					height: 200rpx;
				}
				.scan-QR {
					width: 100%;
					font-size: 12px;
					color: #999999;
					font-weight: 400;
					text-align: center;
				}
			}
		}
	}
	.address{
		display:flex;
	}
</style>
